<template><div><h1 id="slice" tabindex="-1"><a class="header-anchor" href="#slice" aria-hidden="true">#</a> _.slice</h1>
<h2 id="解析" tabindex="-1"><a class="header-anchor" href="#解析" aria-hidden="true">#</a> 解析</h2>
<div class="language-javascript ext-js line-numbers-mode"><pre v-pre class="language-javascript"><code><span class="token keyword">function</span> <span class="token function">slice</span><span class="token punctuation">(</span><span class="token parameter">array<span class="token punctuation">,</span> start<span class="token punctuation">,</span> end</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
  <span class="token comment">// 保证不会取到空值的 length 属性</span>
  <span class="token keyword">let</span> length <span class="token operator">=</span> array <span class="token operator">==</span> <span class="token keyword">null</span> <span class="token operator">?</span> <span class="token number">0</span> <span class="token operator">:</span> array<span class="token punctuation">.</span>length
  <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token operator">!</span>length<span class="token punctuation">)</span> <span class="token punctuation">{</span>
    <span class="token keyword">return</span> <span class="token punctuation">[</span><span class="token punctuation">]</span>
  <span class="token punctuation">}</span>
  start <span class="token operator">=</span> start <span class="token operator">==</span> <span class="token keyword">null</span> <span class="token operator">?</span> <span class="token number">0</span> <span class="token operator">:</span> start
  end <span class="token operator">=</span> end <span class="token operator">===</span> <span class="token keyword">undefined</span> <span class="token operator">?</span> length <span class="token operator">:</span> end
  <span class="token comment">// 保证传入的 start 与 end 不会超出数组边界</span>
  <span class="token comment">//  _.slice([1, 2, 3], 0, -1) => [1, 2]</span>
  <span class="token keyword">if</span> <span class="token punctuation">(</span>start <span class="token operator">&lt;</span> <span class="token number">0</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
    start <span class="token operator">=</span> <span class="token operator">-</span>start <span class="token operator">></span> length <span class="token operator">?</span> <span class="token number">0</span> <span class="token operator">:</span> <span class="token punctuation">(</span>length <span class="token operator">+</span> start<span class="token punctuation">)</span>
  <span class="token punctuation">}</span>
  end <span class="token operator">=</span> end <span class="token operator">></span> length <span class="token operator">?</span> length <span class="token operator">:</span> end
  <span class="token keyword">if</span> <span class="token punctuation">(</span>end <span class="token operator">&lt;</span> <span class="token number">0</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
    end <span class="token operator">+=</span> length
  <span class="token punctuation">}</span>
  <span class="token comment">// 这其中用到了无符号右移进行取整操作，下面会详细讲</span>
  length <span class="token operator">=</span> start <span class="token operator">></span> end <span class="token operator">?</span> <span class="token number">0</span> <span class="token operator">:</span> <span class="token punctuation">(</span><span class="token punctuation">(</span>end <span class="token operator">-</span> start<span class="token punctuation">)</span> <span class="token operator">>>></span> <span class="token number">0</span><span class="token punctuation">)</span>
  start <span class="token operator">>>>=</span> <span class="token number">0</span>
  <span class="token keyword">let</span> index <span class="token operator">=</span> <span class="token operator">-</span><span class="token number">1</span>
  <span class="token keyword">const</span> result <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">Array</span><span class="token punctuation">(</span>length<span class="token punctuation">)</span>
  <span class="token keyword">while</span> <span class="token punctuation">(</span><span class="token operator">++</span>index <span class="token operator">&lt;</span> length<span class="token punctuation">)</span> <span class="token punctuation">{</span>
    result<span class="token punctuation">[</span>index<span class="token punctuation">]</span> <span class="token operator">=</span> array<span class="token punctuation">[</span>index <span class="token operator">+</span> start<span class="token punctuation">]</span>
  <span class="token punctuation">}</span>
  <span class="token keyword">return</span> result
<span class="token punctuation">}</span>
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><p>关于下面这段代码大家在看到时候有可能会有些疑问：</p>
<div class="language-javascript ext-js line-numbers-mode"><pre v-pre class="language-javascript"><code><span class="token keyword">if</span> <span class="token punctuation">(</span>end <span class="token operator">&lt;</span> <span class="token number">0</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
  end <span class="token operator">+=</span> length
<span class="token punctuation">}</span>
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><p>其操作应该是一个将 end 转为正数的过程，但是如果我们传入数组的长度为 2，end 为 -10，那么 -10 + 2 还是一个负数，其实下面还有一行代码处理了这个问题：</p>
<div class="language-javascript ext-js line-numbers-mode"><pre v-pre class="language-javascript"><code>length <span class="token operator">=</span> start <span class="token operator">></span> end <span class="token operator">?</span> <span class="token number">0</span> <span class="token operator">:</span> <span class="token punctuation">(</span><span class="token punctuation">(</span>end <span class="token operator">-</span> start<span class="token punctuation">)</span> <span class="token operator">>>></span> <span class="token number">0</span><span class="token punctuation">)</span>
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div></div></div><p>如果用户的输入正确，那么在进行 <code v-pre>end += length</code> 操作之后，end 的值应该大于 start，否则输入错误。关于代码中用到的 <code v-pre>&gt;&gt;&gt;</code> 操作符，请看下面的分析</p>
<h3 id="无符号右移" tabindex="-1"><a class="header-anchor" href="#无符号右移" aria-hidden="true">#</a> &gt;&gt;&gt; 无符号右移</h3>
<p><code v-pre>&gt;&gt;&gt;</code> 为无符号右移操作符，会将数值的所有 32 位都向右移。对于正数，有符号右移（&gt;&gt;）与无符号右移的结果相同。以 64 为例，64 向右移动 5 位，会变成 2：</p>
<div class="language-javascript ext-js line-numbers-mode"><pre v-pre class="language-javascript"><code><span class="token keyword">let</span> oldValue <span class="token operator">=</span> <span class="token number">64</span><span class="token punctuation">;</span>
<span class="token keyword">let</span> newValue <span class="token operator">=</span> oldValue <span class="token operator">>>></span> <span class="token number">5</span><span class="token punctuation">;</span>
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div></div></div><p>lodash 使用 <code v-pre>&gt;&gt;&gt;</code> 目的是 <strong>将可能存在的小数转为整数</strong>：</p>
<div class="language-javascript ext-js line-numbers-mode"><pre v-pre class="language-javascript"><code><span class="token number">1.222</span> <span class="token operator">>>></span> <span class="token number">0</span> <span class="token operator">==</span> <span class="token number">1</span>
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div></div></div><h2 id="文档" tabindex="-1"><a class="header-anchor" href="#文档" aria-hidden="true">#</a> 文档</h2>
<div class="language-javascript ext-js line-numbers-mode"><pre v-pre class="language-javascript"><code>_<span class="token punctuation">.</span><span class="token function">slice</span><span class="token punctuation">(</span>array<span class="token punctuation">,</span> <span class="token punctuation">[</span>start<span class="token operator">=</span><span class="token number">0</span><span class="token punctuation">]</span><span class="token punctuation">,</span> <span class="token punctuation">[</span>end<span class="token operator">=</span>array<span class="token punctuation">.</span>length<span class="token punctuation">]</span><span class="token punctuation">)</span>
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div></div></div><p>裁剪数组array，从 start 位置开始到end结束，但不包括 end 本身的位置。</p>
<p>Note: 这个方法用于代替 Array#slice 来确保数组正确返回。</p>
<h3 id="添加版本" tabindex="-1"><a class="header-anchor" href="#添加版本" aria-hidden="true">#</a> 添加版本</h3>
<p>3.0.0</p>
<h3 id="参数" tabindex="-1"><a class="header-anchor" href="#参数" aria-hidden="true">#</a> 参数</h3>
<p>array (Array): 要裁剪数组。
[start=0] (number): 开始位置。
[end=array.length] (number): 结束位置。</p>
<h3 id="返回" tabindex="-1"><a class="header-anchor" href="#返回" aria-hidden="true">#</a> 返回</h3>
<p>(Array): 返回 数组array 裁剪部分的新数组。</p>
</div></template>


